<template>
<div class="mainContent">
  <pathTracking :path="Model.path" />
  <div class="container">
    <div class="bgWhite bgRadius">
      <el-row>
        <div class="common-table-title">
          <div class="common-table-icon"></div>
          <div class="common-table-fl">查询条件</div>
        </div>
      </el-row>
      <!-- 高级搜索 -->
      <advancedSearch :option="Model.filterOption" @getChild="getFilterData" @onSearch="onFilterSearch" @onClear="onFilterClear" @onExport="onFilterExport"></advancedSearch>
    </div>
    <!-- 表格 -->
    <div class="table">
      <el-row>
        <div class="common-table-title">
          <div class="common-table-icon"></div>
          <div class="common-table-fl">
            <span>到货单列表</span>
          </div>
          <div class="common-btn-group">
            <div class="common-table-btn-item" @click="onTableExport">导出</div>
            <div class="common-table-btn-item" @click="printingArrialOrder">打印到货单</div>
          </div>
        </div>
      </el-row>
      <el-table :data="Model.tableData" border style="width: 100%;"  @selection-change="onTableSelectionChange">
        <el-table-column type="selection" width="50" fixed></el-table-column>
        <el-table-column fixed="index" label="序号" width="50"></el-table-column>
        <el-table-column prop="number" label="到货单号" width="200">
          <template slot-scope="scope">
            <el-button type="text" @click="toTableDetail(scope.row,'arrivalGoodsDetail')">{{scope.row.number}}</el-button>
          </template>
        </el-table-column>
        <el-table-column prop="settlementNumber" label="结算单号" width="120"></el-table-column>
        <el-table-column prop="supplierInfoName" label="供应商" width="120"></el-table-column>
        <el-table-column prop="typeName" label="采购单类型" width="200"></el-table-column>
        <el-table-column prop="mainQuantity" label="发货数量" width="120"></el-table-column>
        <el-table-column prop="accreditation" label="是否制证" width="120"></el-table-column>
        <el-table-column prop="createUser" label="制证状态" width="120"></el-table-column>
        <el-table-column prop="deliverTime" label="发货时间" width="200"></el-table-column>
        <el-table-column prop="updateUser" label="DR收货时间" width="200"></el-table-column>
        <el-table-column prop="sureTime" label="质检时间" width="200"></el-table-column>
        <el-table-column prop="statusName" label="到货单状态" width="120"></el-table-column>
        <el-table-column fixed="right" label="操作" width="210">
          <template slot-scope="scope">
            <div class="btnGroup">
              <div class="operate-btn" v-if="scope.row.status === 10" @click="onReceive(scope.row.id)">收货</div>
            </div>
          </template>
        </el-table-column>
      </el-table>
    </div>
    <!-- 分页 -->
    <el-row class="pagination-cont">
      <el-pagination @size-change="onTableSizeChange" background @current-change="onTableCurrentChange" :current-page="Model.pager.params.pageIndex" :page-sizes="Model.pager.pageSizeArr" :pager-count="5" :page-size="Model.pager.params.pageSize" layout="total, sizes, prev, pager, next, jumper" :total="Model.pager.pageTotal"></el-pagination>
    </el-row>
  </div>
</div>
</template>

<script>
import pathTracking from "@/components/common/pathTracking";
import pagination from "@/components/common/pagination.vue";
import card from "@/components/common/filterBtns";
import advancedSearch from "@/components/common/filter/advancedSearch";

import Model from "./model.js";
import Controller from "./controller.js";
export default {
  name: "purchase",
  mixins: [Model, Controller],
  components: {
    advancedSearch,
    pagination,
    pathTracking,
    card
  }
};
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->

<style lang="less" scoped>
@import "./index.less";
</style>
